<%--
  Created by IntelliJ IDEA.
  User: Champion
  Date: 2023/9/18
  Time: 20:35
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>百度一下，你就知道</title>
</head>
<body>
<!-- <h1>通过servelet页面跳转</h1> -->
<h1>当前是A页面</h1>
<button id="redirect">点击跳转至B页面</button>
<div style="display: flex;flex-direction: column">
<div style="margin: auto;">
    <img src="../images/baidu_log.png" width="270" height="autom">
</div>
<div style="margin: auto">
	<span>
        <input id="input" class="input">
        <button id="button" class="button">百度一下</button>
    </span>
</div>
</div>
</body>
<%--嵌入式的css引用--%>
<style type="text/css">
    .input{
        width: 512px;
        height: 16px;
        padding:12px 16px;
        font-size: 16px;
        margin: 0;
        vertical-align: top;/*顶部式的垂直居中*/
        outline: 0;/*轮廓线显示0*/
        box-shadow: none;
        border-radius: 10px 0 0 10px;
        border: 2px solid #c4c7ce;
        background: #fff;
        color: #222;
        overflow: hidden;
        box-sizing: content-box;
        -webkit-tap-highlight-color: transparent;/*将当前标签高亮显示透明*/
    }
    .button{
        width: 108px;
        height: 44px;
        background-color: #4e6ef2;
        border-radius: 0 10px 10px 0;
        font-size: 17px;
        color: #fff;
        font-weight: 400;
        border: none;
        cursor: pointer;/*鼠标移到按钮上变小手*/
    }
</style>
</html>
<%--脚本语言--%>
<script>
    //用来获取交换点击监听事件，点击后的任务在function中写
    document.getElementById("button").addEventListener("click",function (ev) {
        //通过绑定input框组件获取input框输入的值.value取值
        var content=document.getElementById("input").value;
        //输出文本框输入的信息
        console.log(content);
        //发送一个httpServletRequest请求
        window.location.href="/javaweb_war_exploded/Myservlet?content="+content;
        //
    })
</script>
